<!--
  精选
-->
<template>
  <scroll :data="data" 
    :loading="true"
    @loadMore="onPullUp"
    :clicked="false">
    <banner :dataKey="banner.concentration"></banner>
    <icon-menu></icon-menu>
    <grid-four :blockId="block.high"></grid-four>
    <grid-four :blockId="block.good"></grid-four>
    <grid-two :blockId="block.work"></grid-two>
    <grid-four :blockId="block.starter"></grid-four>
    <grid-two :blockId="block.all_look"></grid-two>
    <!--定制喜好-->
    <banner :dataKey="banner.advertise"></banner>
    <list :bookList="booksList"></list>
  </scroll>
</template>

<script>
import Scroll from "components/Scroll";

import Banner from "../../../components/Banner";
import IconMenu from "../components/IconMenu";
import GridFour from "../components/GridFour";
import GridTwo from "../components/GridTwo";
import List from "../components/List";

import { config } from "assets/js/data.js";

import {findListBySortIds} from 'api/BooksApi'
export default {
  name: "ConcentrationView",
  components: {
    Scroll,
    Banner,
    IconMenu,
    GridFour,
    GridTwo,
    List
  },
  data() {
    return {
      data: [],
      banner: config.banner,
      block: config.block,
      search: {
        scrollId: "",
        pageSize: 15
      },
      booksList: [],
      tmp: []
    };
  },
  methods: {
    onPullUp (currentIndex, $scroll) {
      this.findListBySortIds();
      
      if(this.tmp.length == 0) {
        $scroll.forceUpdate()
      }
    },
    findListBySortIds () {
      this.tmp = []
      findListBySortIds(this.search).then(res => {
        if(res.meta.success) {
          this.tmp = res.data.data
          this.booksList = this.booksList.concat(this.tmp);
          this.search.scrollId = res.data.pagination.scrollId
        }
      });
    }
  },
  created () {
    this.findListBySortIds();
  }
};
</script>

<style lang="stylus" scoped></style>
